<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>assan - Professional theme</title>

        <!-- Bootstrap -->
        <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
        <!-- custom css (blue color by default) -->
        <link href="css/style.css" rel="stylesheet" type="text/css" media="screen">
        <!-- custom css (green color ) -->
        <!--      <link href="css/style-green.css" rel="stylesheet" type="text/css" media="screen">-->
        <!-- custom css (red color ) -->
        <!--        <link href="css/style-red.css" rel="stylesheet" type="text/css" media="screen">-->
        <!-- custom css (yellow color ) -->
        <!--       <link href="css/style-yellow.css" rel="stylesheet" type="text/css" media="screen">-->
        <!-- custom css (sea-greean color ) -->
        <!--      <link href="css/style-sea-green.css" rel="stylesheet" type="text/css" media="screen">-->
        <!-- custom css (style-gold color ) -->
        <!--       <link href="css/style-gold.css" rel="stylesheet" type="text/css" media="screen">-->
        <!-- font awesome for icons -->
        <link href="font-awesome-4.3.0/css/font-awesome.min.css" rel="stylesheet">
        <!-- flex slider css -->
        <link href="css/flexslider.css" rel="stylesheet" type="text/css" media="screen">
        <!-- animated css  -->
        <link href="css/animate.css" rel="stylesheet" type="text/css" media="screen">
        <!--web fonts-->  


        <!--Revolution slider css-->
        <link href="rs-plugin/css/settings.css" rel="stylesheet" type="text/css" media="screen">
        <link href="css/rev-style.css" rel="stylesheet" type="text/css" media="screen">
        <!--google fonts-->
        
        
        <link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
        <!--owl carousel css-->
        <link href="css/owl.carousel.css" rel="stylesheet" type="text/css" media="screen">
        <link href="css/owl.theme.css" rel="stylesheet" type="text/css" media="screen">
        <!--mega menu -->
        <link href="css/yamm.css" rel="stylesheet" type="text/css">
        <!--popups css-->
        <link href="css/magnific-popup.css" rel="stylesheet" type="text/css">
        <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
          <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
          <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->

        
        

    </head>
    <body>
        <!--navigation -->
        <!-- Static navbar -->
        <div class="navbar navbar-default navbar-static-top yamm sticky" role="navigation">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="index.html"><img src="img/logo.png" alt="ASSAN"></a>
                </div>
                <div class="navbar-collapse collapse">
                    <ul class="nav navbar-nav navbar-right" style="margin-right:70px;">
                        <li class="dropdown active">
                            <a href="index.html">首页 </a>
                        </li>
                        <!--menu home li end here-->
                           <li class="dropdown">
                            <a href="blog-timeline.html">产品 </a>
                            <!--<ul class="dropdown-menu multi-level" style="left:2px;" role="menu">-->
                                    <!--<li class="dropdown-submenu">-->
                                    <!--<a tabindex="-1" href="A3_detail.html">A3 </a>-->
                                <!--</li>-->
                                <!--<li class="dropdown-submenu">-->
                                    <!--<a tabindex="-1" href="A6_detail.html">A6 </a>-->
                                <!--</li>-->
                                <!--<li class="dropdown-submenu">-->
                                    <!--<a tabindex="-1" href="#">A7 </a>-->
                                <!--</li>-->
                                <!--<li class="dropdown-submenu">-->
                                    <!--<a tabindex="-1" href="#">A8 </a>-->
                                <!--</li>-->
                            <!--</ul>-->
                        </li>
                        <!--menu Portfolio li end here-->
                        <li class="dropdown">
                            <a href="App_download.html">APP </a>
                            <!--<ul class="dropdown-menu" role="menu">-->
                               <!--<li><a href="blog-full.html">Blog - full width</a></li>-->
                                <!--<li><a href="blog-leftimg.html">Blog - left image</a></li>-->
                                <!--<li><a href="blog-sidebar.html">Blog - sidebar</a></li>-->
                                <!--<li><a href="blog-2col.html">Blog - 2 column</a></li>-->
                                <!--<li><a href="blog-timeline.html">Blog - Timeline</a></li>-->
                                <!--<li><a href="blog-masonary.html">Blog - Masonry</a></li>-->
                                <!--<li><a href="blog-single.html">Blog - Single</a></li>-->
                            <!--</ul>-->
                        </li>
                        <!--menu blog li end here-->
                        <li class="dropdown">
                            <a href="https://sangeyouzi.tmall.com/" >商城 </a>

                        </li>
                        <!--menu pages li end here-->
                        <li class="dropdown">
                            <a href="About_Us.html" >关于我们 </a>
                            <!--<ul class="dropdown-menu" style="left:2px;" role="menu">-->
                                <!--<li><a href="index.html">公司简介</a></li>-->
                                <!--<li><a href="index.html">团队介绍</a></li>-->
                                <!--<li><a href="index.html">成果展示</a></li>-->
                                <!--<li><a href="index.html">新闻内容</a></li>-->
                                <!--<li><a href="index.html">联系我们</a></li>-->

                            <!--</ul>-->
                        </li> <!--menu Shop li end here-->
                    </ul>
                </div><!--/.nav-collapse -->
            </div><!--container-->
        </div><!--navbar-default-->

        <!--rev slider start-->

        <div class="fullwidthbanner">
            <div class="ken-burns-banner">
                <ul>    <!-- SLIDE  -->
                    <li class="dark" data-transition="fade" data-slotamount="1" data-masterspeed="1500" data-thumb="img/bg-1.jpg" data-delay="10000"  data-saveperformance="off" data-title="slider 1">
                        <!-- MAIN IMAGE -->
                        <img src="img/bg-1.jpg"  alt="kenburns1"  data-bgposition="left center" data-kenburns="on" data-duration="10000" data-ease="Linear.easeNone" data-bgfit="130" data-bgfitend="100" data-bgpositionend="right center">
                        <!-- LAYERS -->
                        <div class="caption customin customout tp-resizeme ken-burns-cap  font-alt" 
                             data-x="center" 
                             data-hoffset="0" 
                             data-y="center" 
                             data-voffset="-100" 
                             data-customin="x:-50;y:-300;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.5;scaleY:0.5;skewX:0;skewY:0;opacity:0;transformPerspective:0;transformOrigin:50% 50%;" 
                             data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;" 

                             data-speed="800" 
                             data-start="1000" 
                             data-startslide="1" 

                             data-easing="Power4.easeOut" 
                             data-endspeed="500" 
                             data-endeasing="Power4.easeIn">

                            Assan is clean & modern design

                        </div>

                        <div class="caption customin customout tp-resizeme Ken-burns-heading font-alt" 
                             data-x="center" 
                             data-hoffset="0" 
                             data-y="center" 
                             data-voffset="0" 
                             data-customin="x:0;y:0;z:0;rotationX:90;rotationY:0;rotationZ:0;scaleX:1;scaleY:1;skewX:0;skewY:0;opacity:0;transformPerspective:200;transformOrigin:50% 0%;" 
                             data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;" 
                             data-speed="800" 
                             data-start="1300" 
                             data-startslide="1" 

                             data-easing="Power4.easeOut" 
                             data-endspeed="500" 
                             data-endeasing="Power4.easeIn">

                            Make it Awesome

                        </div>


                        <div class="caption customin customout tp-resizeme" 
                             data-x="center" 
                             data-hoffset="0" 
                             data-y="center" 
                             data-voffset="120" 
                             data-customin="x:50;y:150;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.5;scaleY:0.5;skewX:0;skewY:0;opacity:0;transformPerspective:0;transformOrigin:50% 50%;" 
                             data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;" 
                             data-speed="800" 
                             data-start="1500" 
                             data-startslide="1" 

                             data-easing="Power4.easeOut" 
                             data-endspeed="500" 
                             data-endeasing="Power4.easeIn">
                            <div class="rev-buttons">

                                <a href="#" class="btn btn-theme-bg btn-lg">
                                    See More
                                </a>
                                <a href="#" class="btn btn-lg border-white">Get it now</a>

                            </div>

                        </div>
                    </li>
                    <!-- SLIDE  -->
                    <li data-transition="slideup" data-slotamount="1" data-masterspeed="1500" data-thumb="img/bg-2.jpg" data-delay="10000"  data-saveperformance="off"  data-title="slider 2">
                        <!-- MAIN IMAGE -->
                        <img src="img/bg-2.jpg"  alt="kenburns6"  data-bgposition="center bottom" data-kenburns="on" data-duration="10000" data-ease="Linear.easeNone" data-bgfit="100" data-bgfitend="120" data-bgpositionend="center top">
                        <!-- LAYERS -->


                        <div class="caption customin customout tp-resizeme ken-burns-cap  font-alt" 
                             data-x="center" 
                             data-hoffset="0" 
                             data-y="center" 
                             data-voffset="-100" 
                             data-customin="x:-50;y:-300;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.5;scaleY:0.5;skewX:0;skewY:0;opacity:0;transformPerspective:0;transformOrigin:50% 50%;" 
                             data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;" 

                             data-speed="800" 
                             data-start="800" 
                             data-startslide="1" 

                             data-easing="Power4.easeOut" 
                             data-endspeed="500" 
                             data-endeasing="Power4.easeIn">

                            Business / Portfolio / Agency / Personal

                        </div>

                        <div class="caption customin customout tp-resizeme Ken-burns-heading font-alt" 
                             data-x="center" 
                             data-hoffset="0" 
                             data-y="center" 
                             data-voffset="-14" 
                             data-customin="x:0;y:0;z:0;rotationX:90;rotationY:0;rotationZ:0;scaleX:1;scaleY:1;skewX:0;skewY:0;opacity:0;transformPerspective:200;transformOrigin:50% 0%;" 
                             data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;" 
                             data-speed="800" 
                             data-start="1200" 
                             data-startslide="1" 

                             data-easing="Power4.easeOut" 
                             data-endspeed="500" 
                             data-endeasing="Power4.easeIn">

                            Multipurpose design

                        </div>


                        <div class="caption customin customout tp-resizeme" 
                             data-x="center" 
                             data-hoffset="0" 
                             data-y="center" 
                             data-voffset="83" 
                             data-customin="x:50;y:150;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.5;scaleY:0.5;skewX:0;skewY:0;opacity:0;transformPerspective:0;transformOrigin:50% 50%;" 
                             data-customout="x:0;y:0;z:0;rotationX:0;rotationY:0;rotationZ:0;scaleX:0.75;scaleY:0.75;skewX:0;skewY:0;opacity:0;transformPerspective:600;transformOrigin:50% 50%;" 
                             data-speed="800" 
                             data-start="1500" 
                             data-startslide="1" 

                             data-easing="Power4.easeOut" 
                             data-endspeed="500" 
                             data-endeasing="Power4.easeIn">

                            <div class="rev-buttons">

                                <a href="#" class="btn btn-theme-bg btn-lg">
                                    See More
                                </a>
                                <a href="#" class="btn btn-lg border-white">See all features</a>

                            </div>

                        </div>
                    </li>
                </ul>
            </div>
        </div><!--full width banner-->


        <section class="services-wrap">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="center-heading">
                            <h2>技术展示</h2>
                            <span class="center-line"></span>
                        </div>
                    </div>                   
                </div><!--center heading row-->
                <div style="width: 100%">
                    <div  style="float: left;width: 47%;height:350px;border: 1px solid #bbb;">

                    </div>
                    <div  style="float: right;width: 47%;height:350px;border: 1px solid #bbb;">
                        <div class="col-md-4 col-sm-6 margin20" style="width: 50%;margin-top: 55px;">
                            <div class="services-box wow animated fadeInUp" data-wow-duration="700ms" data-wow-delay="100ms">
                                <div class="services-box-icon">
                                    <i class="fa fa-pencil"></i>
                                </div><!--services icon-->
                                <div class="services-box-info">
                                    <h4>Web &AMP; Graphics Design</h4>
                                </div>
                            </div><!--services box-->
                        </div><!--services col-->
                        <div class="col-md-4 col-sm-6 margin20" style="width: 50%;height: 100px;margin-top: 55px;">
                            <div class="services-box wow animated fadeInUp" data-wow-duration="700ms" data-wow-delay="200ms">
                                <div class="services-box-icon">
                                    <i class="fa fa-globe"></i>
                                </div><!--services icon-->
                                <div class="services-box-info">
                                    <h4>Web Development</h4>
                                </div>
                            </div><!--services box-->
                        </div><!--services col-->
                        <div class="col-md-4 col-sm-6 margin20" style="width: 50%;height: 100px;margin-top: 55px;">
                            <div class="services-box wow animated fadeInUp" data-wow-duration="700ms" data-wow-delay="300ms">
                                <div class="services-box-icon">
                                    <i class="fa fa-users"></i>
                                </div><!--services icon-->
                                <div class="services-box-info">
                                    <h4>Customer Support</h4>
                                </div>
                            </div><!--services box-->
                        </div><!--services col-->

                        <div class="col-md-4 col-sm-6 margin20" style="width: 50%;height: 100px;margin-top: 55px;">
                            <div class="services-box wow animated fadeInUp" data-wow-duration="700ms" data-wow-delay="400ms">
                                <div class="services-box-icon">
                                    <i class="fa fa-crop"></i>
                                </div><!--services icon-->
                                <div class="services-box-info">
                                    <h4>Pixel perfect design</h4>
                                </div>
                            </div><!--services box-->
                        </div><!--services col-->
                    </div><!--services row-->
                </div>
            </div>
        </section><!--section services-->
        <div class="divide40"></div>
        <!--=== Content Part ===-->
        <div class="container">
            <ul class="timeline">
                <li>
                    <div class="timeline-badge primary"><i class="fa fa-image"></i></div>
                    <div class="timeline-panel wow animated fadeInUp">
                        <div class="timeline-heading">
                            <img class="img-responsive" src="img/ceshi/A6.jpg" alt="" style="height: 350px;"/>
                        </div>

                        <div class="timeline-body">
                            <h2><a href="#">Standard image post</a></h2>
                            <ul class="list-inline post-detail">
                                <li>by <a href="#">assan</a></li>
                                <li><i class="fa fa-calendar"></i> 31st july 2014</li>
                            </ul>
                            <p>Lorem Ipsum is simply dummy text of the printing and type setting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
                            <a class="btn border-theme" href="A6_detail.html">Read More</a>
                        </div>

                    </div>
                </li>
                <li class="timeline-inverted">
                    <div class="timeline-badge primary"><i class="fa fa-image invert"></i></div>
                    <div class="timeline-panel wow animated fadeInUp">
                        <div class="timeline-heading">
                            <img class="img-responsive" src="img/ceshi/A3MAX.jpg" alt="" style="height: 350px;"/>
                        </div>
                        <div class="timeline-body">
                            <h2><a href="#">Standard image post</a></h2>
                            <ul class="list-inline post-detail">
                                <li>by <a href="#">assan</a></li>
                                <li><i class="fa fa-calendar"></i> 31st july 2014</li>
                            </ul>
                            <p>Lorem Ipsum is simply dummy text of the printing and type setting industry.printing and type setting industry Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. when an unknown printer took a galley of type and scrambled it to make a type specimen book.
                            </p>

                            <a class="btn border-theme" href="A3_detail.html">Read More</a>
                        </div>

                    </div>
                </li>
                <li>
                    <div class="timeline-badge primary"><i class="fa fa-image"></i></div>
                    <div class="timeline-panel wow animated fadeInUp">
                        <div class="timeline-heading">
                            <img class="img-responsive" src="img/ceshi/A3.jpg" alt="" style="height: 350px;"/>
                        </div>

                        <div class="timeline-body">
                            <h2><a href="#">Standard image post</a></h2>
                            <ul class="list-inline post-detail">
                                <li>by <a href="#">assan</a></li>
                                <li><i class="fa fa-calendar"></i> 31st july 2014</li>
                            </ul>
                            <p>Lorem Ipsum is simply dummy text of the printing and type setting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
                            <a class="btn border-theme" href="#">Read More</a>
                        </div>

                    </div>
                </li>
                <li class="timeline-inverted">
                    <div class="timeline-badge primary"><i class="fa fa-image"></i></div>
                    <div class="timeline-panel wow animated fadeInUp">
                        <div class="timeline-heading">
                            <img class="img-responsive" src="img/timeline/sku1.jpg" alt="" style="height: 350px;"/>
                        </div>
                        <div class="timeline-body">
                            <h2><a href="#">Standard image post</a></h2>
                            <ul class="list-inline post-detail">
                                <li>by <a href="#">assan</a></li>
                                <li><i class="fa fa-calendar"></i> 31st july 2014</li>
                            </ul>
                            <p>Lorem Ipsum is simply dummy text of the printing and type setting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
                            <a class="btn border-theme" href="#">Read More</a>
                        </div>

                    </div>
                </li>

                <li class="clearfix" style="float: none;"></li>
            </ul>

        </div><!--/container-->
        <div class="divide40"></div>
        <footer id="footer" style="padding: 10px 0 0;">
            <div class="container">

                <div class="row">
                    <div class="col-md-3 col-sm-6 margin30" style="margin-left:75px; ">
                        <div class="footer-col">
                            <h3 style="margin-bottom:15px;">About assan</h3>
                            <p>
                                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer lorem quam, adipiscing condimentum tristique vel, eleifend sed turpis.
                            </p>
                        </div>                        
                    </div><!--footer col-->
                    <div class="col-md-3 col-sm-6 margin30" style="margin-left:75px; ">
                        <div class="footer-col">
                            <h3 style="margin-bottom:15px;">Contact</h3>

                            <ul class="list-unstyled contact">
                                <li><p style="margin-bottom:7px"><strong><i class="fa fa-map-marker"></i> Address:</strong> vaisahali, jaipur, 302012</p></li>
                                <li><p style="margin-bottom:7px"><strong><i class="fa fa-envelope"></i> Mail Us:</strong> <a href="#">Support@designmylife.com</a></p></li>
                                <li><p style="margin-bottom:7px"><strong><i class="fa fa-phone"></i> Phone:</strong> +91 1800 2345 2132</p></li>
                                <li><p style="margin-bottom:7px"><strong><i class="fa fa-print"></i> Fax</strong> 1800 2345 2132</p></li>

                            </ul>
                        </div>                        
                    </div><!--footer col-->
                    <div class="col-md-3 col-sm-6 margin30" style="margin-left:75px; ">
                        <div class="footer-col">
                            <h3 style="margin-bottom:15px;">Featured Work</h3>
                            <ul class="list-inline f2-work">
                                <li><a href="portfolio-single.html"><img src="img/img-1.jpg" class="img-responsive" alt=""></a></li>
                                <li><a href="portfolio-single.html"><img src="img/img-2.jpg" class="img-responsive" alt=""></a></li>
                                <li><a href="portfolio-single.html"><img src="img/img-3.jpg" class="img-responsive" alt=""></a></li>
                                <li><a href="portfolio-single.html"><img src="img/img-4.jpg" class="img-responsive" alt=""></a></li>
                                <li><a href="portfolio-single.html"><img src="img/img-5.jpg" class="img-responsive" alt=""></a></li>
                                <li><a href="portfolio-single.html"><img src="img/img-6.jpg" class="img-responsive" alt=""></a></li>
                             </ul>
                        </div>
                    </div><!--footer col-->

                </div>
                <div class="row" >
                    <div class="col-md-12 text-center"  style="margin-top: -70px;">
                        <div class="footer-btm" style="padding: 10px;">
                            <span>&copy;2014. Theme by Design_mylife</span>
                        </div>
                    </div>
                </div>
            </div>
        </footer><!--default footer end here-->
         <!--scripts and plugins -->
        <!--must need plugin jquery-->
        <script src="js/jquery.min.js"></script>        
        <!--bootstrap js plugin-->
        <script src="bootstrap/js/bootstrap.min.js" type="text/javascript"></script>       
        <!--easing plugin for smooth scroll-->
        <script src="js/jquery.easing.1.3.min.js" type="text/javascript"></script>
        <!--sticky header-->
        <script type="text/javascript" src="js/jquery.sticky.js"></script>
        <!--flex slider plugin-->
        <script src="js/jquery.flexslider-min.js" type="text/javascript"></script>
        <!--parallax background plugin-->
        <script src="js/jquery.stellar.min.js" type="text/javascript"></script>
        
        
        <!--digit countdown plugin-->
        <script src="http://cdnjs.cloudflare.com/ajax/libs/waypoints/2.0.3/waypoints.min.js"></script>
        <!--digit countdown plugin-->
        <script src="js/jquery.counterup.min.js" type="text/javascript"></script>
        <!--on scroll animation-->
        <script src="js/wow.min.js" type="text/javascript"></script> 
        <!--owl carousel slider-->
        <script src="js/owl.carousel.min.js" type="text/javascript"></script>
        <!--popup js-->
        <script src="js/jquery.magnific-popup.min.js" type="text/javascript"></script>
        <!--you tube player-->
        <script src="js/jquery.mb.YTPlayer.min.js" type="text/javascript"></script>
        
        
        <!--customizable plugin edit according to your needs-->
        <script src="js/custom.js" type="text/javascript"></script>
        <!--revolution slider plugins-->
        <script src="rs-plugin/js/jquery.themepunch.tools.min.js" type="text/javascript"></script>
        <script src="rs-plugin/js/jquery.themepunch.revolution.min.js" type="text/javascript"></script>
        <script src="js/revolution-custom.js" type="text/javascript"></script>

    </body>
</html>
